<template>
  <div class="invoi_wrap">
    <div class="invoi_tsx">
      <div class="invoi_titel">注意</div>
      <div class="invoi_header_list">
        <div>1. 当前显示为自己下单（非现场缴费）包含押金并且可以申请的订单</div>
        <div>
          2. 可申请的订单需同时满足以下几个条件
          <span style="color: #ff0000">未申请过、已到押金退还申请时间;</span>
        </div>
        <div>
          3.
          如已满足第二点所有条件且不再已申请押金之列，仍无法申请押金请咨询工作人员
        </div>
      </div>
    </div>
    <div class="invoi_mian">
      <!-- <div>
        <el-breadcrumb separator-class="el-icon-arrow-right">
          <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
          <el-breadcrumb-item :to="{ path: '/outfit' }"
            >特装</el-breadcrumb-item
          >
          <el-breadcrumb-item>押金退还</el-breadcrumb-item>
        </el-breadcrumb>
      </div> -->
      <div class="invoi_query">
        <el-form
          ref="form"
          label-position="right"
          :model="queryform"
          label-width="100px"
        >
          <el-form-item label="展会">
            <el-select
              size="mini"
              v-model="queryform.options"
              placeholder="请选择展会"
            >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="展位:">
            <el-select
              size="mini"
              v-model="queryform.options"
              placeholder="请选择展会"
            >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
      </div>
      <div>
        <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
          <el-tab-pane label="押金申请" name="first">
            <kfmx></kfmx>
          </el-tab-pane>
          <el-tab-pane label="申请记录" name="second">
            <lsjl></lsjl>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      queryform: {},
      activeName: "first",
    };
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab, event);
    },
  },
};
</script>
<style scoped>
.invoi_wrap {
  background-color: #f2f2f2;
  padding: 50px;
}
.invoi_mian {
  width: 1000px;
  background-color: #fff;
  padding: 10px;
  margin: auto;
}
.invoi_tsx {
  width: 1000px;
  padding: 10px;
  margin: auto;
  margin-bottom: 40px;
  background-color: #fffbe6;
  border: 1px solid #ffe58f;
}
.invoi_titel {
  margin: 10px 0;
}
.invoi_header_list {
  line-height: 30px;
  font-size: 14px;
  color: #595850;
}
.invoi_query {
  margin-bottom: 50px;
}
</style>